<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	template="/template/template_dialog.xhtml">
	<ui:define name="head">
		<title>#{lang.BaoHuQueXianJiChuLi}</title>
		<link rel="stylesheet"
			href="/resources/plugins/datatables/dataTables.bootstrap.css" />
		<link href='/resources/bootstrap/css/bootstrap-datetimepicker.min.css'
			rel='stylesheet' />
		<style>
.bs-callout {
	padding: 20px;
	padding-left: 40px;
	margin: 20px 0;
	border: 1px solid #eee;
	border-left-width: 5px;
	border-radius: 3px;
}

.bs-callout-danger {
	border-left-color: #ce4844;
}

.redNum {
	color: red;
	font-size: 22px;
	margin: 5px;
}

/* .hasSelected {
	color: red;
}

.hasSelected:focus {
	color: red;
}
 */
label {
	margin-left: 10px;
	margin-right: 10px;
	font-weight: normal;
}

input[type="checkbox"] {
	margin-left: 5px;
	margin-right: 5px;
}
td.details-control {
    background: url('/resources/img/table/details_open.png') no-repeat center center;
    cursor: pointer;
}
tr.shown td.details-control {
    background: url('/resources/img/table/details_close.png') no-repeat center center;
}
</style>

	</ui:define>
	<ui:define name="content">
		<div id="contentDiv" class="row" style="padding-left: 20px; padding-right: 20px;">
			<div class="nav-tabs-custom">
				<ul id="selectUL" class="nav nav-tabs pull-right ui-sortable-handle">
					<li class="pull-left header" style="width:1000px;">
						<div class="navbar-form">
							<button id="columnsSelectButton" style="margin: 10px;"
								class="btn btn-default " onclick="onColumnsSelectDivClick();">
								#{lang.LieShaiXuan} <span id="columnsSelectButtonIcon" class="fa fa-caret-down"></span>
							</button>
							<div class="input-group">
								<div class="btn btn-default">
									<i class="fa fa-calendar"></i>
								</div>
								<div class="form-group">
									<input type="text" class="form-control" id="start" /> <input
										class="form-control" type="text" id="end" />
								</div>
								<button class="btn btn-default" onclick="query()">#{lang.ChaXun}</button>
							</div>
							<button id="selectButton" style="margin: 10px;"
								class="btn btn-default" onclick="onSelectDivClick();">
								#{lang.ShuJuShaiXuan} <span id="selectButtonIcon" class="fa fa-caret-down"></span>
							</button>
							
						</div>
					</li>
				</ul>
				<div class="panel-collapse collapse" id="columnsSelectDiv"
					style="position: relative;">
					<table class="table" style="margin: 0;">
						<tbody>
							<tr>
								<td class="col-sm-1" style="font-weight: bold;">#{lang.LieShaiXuan}</td>
								<td class="col-sm-1"><label><input id="columnsAll"
										checked="checked" type="checkBox"
										onchange="selectAllColumns(this.checked,'columns');" />#{lang.QuanXuan}</label></td>
								<td id="columns"> </td>
							</tr>
						</tbody>
					</table>
				</div>
				<div class="panel-collapse collapse" id="selectDiv"
					style="position: relative;">
					<table class="table"  style="margin:0;">
						<tbody>
							<tr>
								<td class="col-sm-1" style="font-weight: bold;">#{lang.ChangZhanMingCheng}</td>
								<td class="col-sm-1"><label><input id="stationsAll"
										checked="checked" type="checkBox"
										onchange="selectAll(this.checked,'stations');" />#{lang.QuanXuan}</label></td>
								<td id="stations"></td>

							</tr>
						</tbody>
					</table>
				</div>
				<div class="tab-content" style="padding:0;">
					<div class="chart" id="tableDiv"
						style="position: relative;">
						<table id="defectTable" class="table table-gray">
						</table>
					</div>
				</div>
			</div>
		</div>
		<h:inputHidden id="startTime"
			value="#{request.getParameter('startTime')}"></h:inputHidden>
		<h:inputHidden id="endTime" value="#{request.getParameter('endTime')}"></h:inputHidden>
		<h:inputHidden id="stationId"
			value="#{request.getParameter('stationId')}"></h:inputHidden>
	</ui:define>
	<ui:define name="contentend">
		<script src="/resources/plugins/echarts/echarts.min.v3.7.2.js"></script>
		<script src="/resources/js/tables/mytable.js"></script>
		<script src="/resources/plugins/datatables/jquery.dataTables.min.js"></script>
		<script
			src="/resources/plugins/datatables/dataTables.bootstrap.min.js"></script>
		<script src="/resources/bootstrap/js/bootstrap-datetimepicker.min.js"></script>
		<script>
		localeTitle={
				XuHao:'#{lang.XuHao}',
				DiaoGuanFanWei:'#{lang.DiaoGuanFanWei}'	,
				ChangZhanMingCheng:'#{lang.ChangZhanMingCheng}',
				SheBei:'#{lang.SheBeiMingCheng}',
				BaoHuXingHao:'#{lang.BaoHuXingHao}',
				BaoHuTuiChuShiJian:'#{lang.BaoHuTuiChuShiJian}',
				BaoHuTouRuShiJian:'#{lang.BaoHuTouRuShiJian}',
				QueXianMiaoShu:'#{lang.QueXianMiaoShu}',
				JianChaJiChuLiQingKuang:'#{lang.JianChaJiChuLiQingKuang}',
			    GongJi:'#{lang.GongJi}',
			    Tiao:'#{lang.Tiao}'
		}
		 var ulHeight = document.getElementById("selectUL").offsetHeight; 
		 var scrollYHeight = wrapperHeight - ulHeight - 120;
		 $('#contentDiv').css('height',wrapperHeight);
		</script>
		<script type="text/javascript" src="dailyDefect.js"></script>
		<script>
			$(function() {
				init();
			});
			function onSelectDivClick() {
				var div = $('#selectDiv');
				if (div.hasClass('in')) {
					div.collapse('hide');
					$('#selectButtonIcon').removeClass("fa fa-caret-up");
					$('#selectButtonIcon').addClass("fa fa-caret-down");
				} else {
					div.collapse('show');
					$('#selectButtonIcon').removeClass("fa fa-caret-down");
					$('#selectButtonIcon').addClass("fa fa-caret-up");
				}
			}
			function onColumnsSelectDivClick(){
				var div = $('#columnsSelectDiv');
				if (div.hasClass('in')) {
					div.collapse('hide');
					$('#columnsSelectButtonIcon').removeClass("fa fa-caret-up");
					$('#columnsSelectButtonIcon').addClass("fa fa-caret-down");
				} else {
					div.collapse('show');
					$('#columnsSelectButtonIcon').removeClass("fa fa-caret-down");
					$('#columnsSelectButtonIcon').addClass("fa fa-caret-up");
				}
				
			}
		</script>
	</ui:define>
</ui:composition>



